#zhgl-map {
  .public-items {
    padding: 0;
    margin-bottom: 8px;
  }
  .public-item {
    padding: 0;
  }
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.clearfix:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}

.clearfix {
  zoom: 1;
}

h1,h2,h3,p {
  margin: 0;
}

.public-inner {
  h3 {
    margin: 0;
    padding: 7px 12px;
    font-size: 16px;
    color: #212a2e;
    background-color: #edf1f3;
  }

  .item-content {
    padding: 13px 14px 15px 25px;

    .item-icon {
      padding-top: 14px;
      width: 51px;
    }

    .item-con1 {
      width: 172px;
    }

    p {
      margin: 0;
      font-size: 12px;
      color: #445761;
      line-height: 26px;
    }

    span {
      color: #1f8bd7;
    }

    .item-go {
      padding-top: 14px;
    }
  }
}

.public-header {
  padding: 7px 12px;
  font-size: 16px;
  background-color: #edf1f3;
}

.public-title {
  color: #1f8bd7;
}

.public-search {
  padding: 12px 16px;
  border-bottom: 1px solid #d6dee2;

  input {
    width: 306px;
    height: 26px;
    outline: none;
  }

  button {
    width: 105px;
    height: 26px;
    outline: none;
    border: solid 1px #b0bec5;
    text-align: center;
    line-height: 26px;
    font-size: 14px;
    color: #ffffff;
    border-radius: 2px;
    background-color: #1f8bd7;
    padding: 0;
  }
}

.public-infor {

  .info-general {
    padding: 0 16px;
  }
  .infor-header {
    padding: 8px 0 10px 0;
  }

  h3 {
    font-size: 16px;
    color: #212a2e;
    padding-top: 4px;
  }

  .item-icon {
    margin-right: 14px;
  }

  .info-detail {
    width: 100%;
    padding: 10px;
    background-color: #edf1f3;
    margin-bottom: 10px;

    p {
      font-size: 12px;
      color: #445761;
      line-height: 26px;
    }

    span {
      color: #1f8bd7;
    }

    .detail-left {
      width: 50%;
    }

    .detail-right {
      width: 50%;
    }
  }

  .info-title {
    padding: 10px 16px;
    border-top: 1px dashed #d6dee2;
  }

  .bus-trend {
    width: 448px;
    height: 113px;
    padding: 0 16px;
    margin-bottom: 16px;
  }

  .bus-sort {
    padding: 0 16px;
  }

  .car-complain {
    padding: 0 16px;
    margin-bottom: 16px;
    .car-label {
      display: inline-block;
      width: 66px;
    }

    .complain-num {
      display: inline-block;
      width: 40px;
    }
  }

  table {
    width: 100%;
    border: none;
    border-collapse:collapse;
    background-color: #edf1f3;

    tr,td,th {
      border: none;
    }

    th:first-of-type {
      padding-left: 14px;
      width: 100px;
    }

    td {
      padding: 6px 0;
      span {
        display: block;
        width: 18px;
        height: 18px;
        border-radius: 2px;
        background-color: #ea9d2c;
        color: #fff;
        font-size: 14px;
        text-align: center;
        line-height: 18px;
      }
    }

    th:nth-child(2) {
      width: 200px;
    }

    td:first-of-type {
      padding-left: 14px;
    }
  }
}

.public-select {
  width: 102px;
  height: 26px;
  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;
  background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll 80px center transparent;
  padding-right: 14px;
  padding-left: 6px;
  border-radius: 2px;
  outline: none;
  font-size: 12px;
  color: rgb(120, 144, 156);
}

select::-ms-expand { display: none; }

.select-mar {
  margin-right: 8px;
}

.public-area {
  padding: 10px 16px;
  label {
    padding-top: 6px;
    font-size: 12px;
    color: #212a2e;
  }
  .label-imp {
    font-size: 16px;
    color: rgb(33, 42, 46);
    padding-top: 3px;
    margin-right: 11px;
  }
}

.public-detail-search {
  padding: 0 16px 10px;
  border-bottom: 1px solid #d6dee2;
  label {
    padding-top: 6px;
    font-size: 12px;
    color: #212a2e;
  }

  input {
    width: 212px;
    height: 26px;
    margin-right: 8px;
    outline: none;
  }

  button {
    width: 102px;
    height: 26px;
    border-radius: 2px;
    background-color: #1f8bd7;
    border: solid 1px #1f8bd7;
    color: #fff;
    font-size: 14px;
    outline: none;
  }
}

.public-one {
  display: none;
}

.bus-site {
  padding: 0 16px;

  .bus-go {
    width: 50%;

    .site-header {
      padding-left: 6px;
    }
  }

  .bus-back {
    width: 50%;
    padding-left: 23px;
    border-left: 1px solid rgba(31, 139, 215, 0.2);
  }

  .site-header {
    margin-bottom: 12px;
    span {
      font-size: 14px;
      color: #1f8bd7;
    }
  }

  .site-icon {
    display: inline-block;
    width: 34px;
    height: 10px;
    background: url("../image/icon_site.png") no-repeat;
  }

  .site-content {
    padding-left: 18px;

    ul {
      border-left: 4px solid #d6dee2;
      padding: 0;
    }

    li {
      height: 33px;
      font-size: 14px;
      color: #445761;
      position: relative;
      list-style: none;
      padding-left: 18px;
      padding-top: 6px;
    }

    .site-start {
      display: block;
      width: 14px;
      height: 14px;
      background: url("../image/icon_site_start.png") no-repeat;
      position: absolute;
      left: -9px;
      top: 8px;
    }

    .icon-site {
      display: block;
      width: 10px;
      height: 10px;
      background: url("../image/icon_site_name.png") no-repeat;
      position: absolute;
      left: -7px;
      top: 10px;
    }
  }
}

.chart-purple-back {
  background-color: #8f60e3;
}

.chart-green-back {
  background-color: #42a75a;
}

#zhgl-map .people-chart-right article div {
  margin: 0 0 5px 0;
}

.num-one {
  padding-left: 2px;
}

#zhgl-map .people-chart-right article div .num-one {
  margin-right: 11px;
}

#zhgl-map .people-chart-right article div .complain-per {
  margin-left: 8px;
}

.public-search-result {
  padding: 12px 16px;

  .search-result {
    width: 100%;
    padding: 7px 10px;
    border: 1px dashed #1fbfd7;
    border-radius: 2px;
    background-color: rgba(31, 191, 215, 0.1);

    p {
      font-size: 12px;
      color: rgb(68, 87, 97);
      line-height: 21px;
    }

    .result-num {
      color: rgb(31, 139, 215);
    }

    .search-restart {
      color: rgb(120, 144, 156);
    }
  }
}

.result-items {
  padding: 0;
}

.result-item {
  width: 100%;
  padding: 7px 16px;
  list-style: none;
  font-size: 12px;
  color: rgb(68, 87, 97);

  .icon-num {
    display: inline-block;
    width: 17px;
    height: 26px;
    text-align: center;
    line-height: 20px;
    color: #fff;
    font-size: 12px;
    margin-right: 8px;
  }

  .icon-blue {
    background: url("../image/icon_blue.png") no-repeat;
  }

  .icon-red {
    background: url("../image/icon_red.png") no-repeat;
  }

  .bike-position {
    color: rgb(31, 139, 215);
    line-height: 26px;
  }

  .icon-time {
    display: inline-block;
    width: 22px;
    height: 23px;
    text-indent: -9999px;
    background: url("../image/icon_time.png") no-repeat;
  }

  .result-item-content {
    p {
      line-height: 22px;
    }
  }

  .result-left,.result-right {
    width: 50%;
  }

  .result-left {
    padding-left: 25px;

    .num-change {
      color: rgb(66, 167, 90);
    }
  }

  .result-address {
    padding-left: 25px;
    clear: both;
  }
}

.bike-panel,.ting-panel {
  display: none;
}

.zhgl-panel-content {
  .result-item-content {
    p {
      line-height: 22px;
      font-size: 12px;
      color: rgb(68, 87, 97);
    }
  }

  .result-right {
    width: 40%;
  }

  .result-left {
    width: 60%;
    .num-change {
      color: rgb(66, 167, 90);
    }
  }

  .result-address {
    clear: both;
  }
}

.ting-title {
  padding: 6px 16px;
  border-top: 1px dashed rgb(214, 222, 226);

  label {
    font-size: 12px;
    color: rgb(33, 42, 46);
    line-height: 26px;
  }
}

.ting-info .car-complain .complain-num {
  width: 36px;
}

.ting-info .car-complain .car-label {
  width: 72px;
}

.ting-all {
  padding: 12px 16px;
  border-bottom: 1px solid rgb(31, 139, 215);
  font-size: 12px;
  color: rgb(68, 87, 97);
  span {
    color: rgb(31, 139, 215);
  }
}

.ting-kind {
  display: inline-block;
  width: 46px;
  height: 20px;
  font-size: 12px;
  color: rgb(255, 255, 255);
  text-align: center;
  line-height: 20px;
  border-radius: 3px;
}

.ting-road {
  background-color: rgb(243, 166, 52);
}

.ting-car {
  background-color: rgb(31, 139, 215);
}